<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
    xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">

<head th:replace="_header_include::frag(~{::title},~{::style},~{})">
    <title>后台管理系统</title>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="css/element-ui.css">
    <link rel="stylesheet" href="css/base.css">
    <style>
        html,
        body {
            background: #eff3f6
        }

        .content-box {
            background-color: #fff;
            margin-top: 20px;
            padding-bottom: 20px;
        }

        .titleLine {
            border-bottom: 1px solid #ecedf2;
            font-size: 16px;
            padding-bottom: 10px;
            padding-left: 10px;
            margin-bottom: 10px;
        }

        .headerBox {
            width: 150px;
            height: 150px;
            border-radius: 50%;
            overflow: hidden;
            margin-bottom: 10px;
            border: 1px solid #ecedf2;
        }

        .headerBox img {
            width: 150px;
            height: 150px;
            border-radius: 50%;
        }

        .changeHeaderImg {
            width: 150px;
        }

        .content {
            margin-top: 20px;
        }

        .dialog-box-operate {
            display: flex;
            align-items: center;
            margin-bottom: 20px;
        }

        .switch-box {
            height: 30px;
        }

        .activity {
            align-items: start;
        }

        .dialog-box-operate .dialog-discount {
            width: 300px;
        }

        .dialog-box-operate .dialog-discount .el-input {
            /* width: 50%; */
        }

        .dialog-box-operate .dialog-box-name {
            margin-right: 15px;
        }

        .dialog-box-operate .name {
            margin-top: 7px;
        }

        .dialog-form {
            display: flex;
        }

        .sign {
            color: red;
        }

        .dialog-form .el-input {
            width: 100%;
        }

        .dialog-form .el-form-item {
            margin-right: 15px;
        }

        .dialog-form .el-form-item__label {
            padding-right: 10px;
            font-size: 14px;
        }

        .dialog-form .icon {
            font-size: 25px;
            cursor: pointer
        }

        .dialog-form .icon-circle {
            margin-right: 10px;
            color: #1f9ada;
        }

        .dialog-box-switch {
            display: flex;
            align-items: center;
        }

        .dialog-box-switch-title {
            margin-right: 10px;
            font-size: 14px;
        }

        .switch {
            margin-right: 10px;
        }

        .el-date-editor .el-range-separator {
            line-height: 22px;
        }

        .el-date-editor .el-range__icon {
            line-height: 22px;
        }

        .dialog-box-operate .el-select {
            width: 250px;
        }

        .el-select__tags {
            max-height: 80px;
            overflow-y: scroll;
        }

        .el-select__tags::-webkit-scrollbar {
            display: none;
        }

        .button-close {
            background: #fff;
            border: 1px solid #dcdfe6;
            color: #606266;
        }

        .el-date-editor .el-range__close-icon {
            line-height: 25px;
        }

        .content-message {
            z-index: 9999 !important;
            position: fixed;
            left: 50%;
            width: 200px;
            height: 40px;
            display: flex;
            justify-content: center;
            align-items: center;
            background: #eef8e9;
            border-radius: 5px;
            top: 10%;

        }

        .message-icon {
            position: absolute;
            left: 15px;
            color: #5aba3e;
            font-size: 15px;
        }

        .message-title {
            color: #5aba3e;
            font-size: 14px;
        }

        .delete-box {
            display: flex;
            justify-content: center;
        }

        .dialog-delete-title {
            /* text-align: center; */
            width: 290px;
        }

        .icon-warning {
            color: #ff545c;
            margin-right: 10px;
        }

        .content-search {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;
            height: 100px;
            padding-right: 20px;
        }

        .search-discount {
            display: flex;
            align-items: center;
        }

        .content-search-box {
            /* flex: 1; */
            /* margin-right: 50px; */
            display: flex;
            align-items: center;
        }

        .content-search-box .el-button--primary {
            width: 150px;
        }

        .content-search-box .el-select {
            width: 200px;
        }

        .content-search-input .el-input {
            width: 200px;
        }

        .content-search-name {
            margin-right: 10px;
            width: 70px;
            text-align: right;
        }

        .pagination {
            display: flex;
            justify-content: flex-end;
            padding-right: 15px;
        }

        .content-tabel {
            padding-left: 15px;
            padding-right: 15px;
        }

        .line {
            width: 14px;
            height: 1px;
            border-top: solid #ACC0D8 1px;
            margin: 0 5px;
            display: inline-block;
        }

        .el-date-picker__time-header {
            display: none;
        }
        .el-input__icon {
            line-height: 25px;
        }
    </style>
</head>
<body>
    <div id="resourceApply" class="resourceApply mainPadding" style="display: none;">
        <el-breadcrumb separator="/" class="elBreadcrumb marginB20">
            <el-breadcrumb-item>Home</el-breadcrumb-item>
            <el-breadcrumb-item>充值管理</el-breadcrumb-item>
            <el-breadcrumb-item>充值优惠设置</el-breadcrumb-item>
        </el-breadcrumb>
        <div class="content">
            <div class="content-button">
                <el-button type="success" @click="newBuild">新建优惠</el-button>
                <el-button type="warning" @click="editBuild">编辑优惠</el-button>
                <el-button type="danger" @click="deleteBuild">删除优惠</el-button>
            </div>
            <div class="content-box">
                <div class="content-search">
                    <div class="content-search-box search-discount">
                        <span class="content-search-name">
                            优惠名称:
                        </span>
                        <div class="content-search-input">
                            <el-input v-model="searchName" placeholder="请输入优惠名称">
                        </div>
                    </div>
                    <div class="content-search-box">
                        <span class="content-search-name">
                            商家名称:
                        </span>
                        <el-select v-model="userId" placeholder="请选择" filterable clearable>
                            <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="content-search-box">
                        <span class="content-search-name">
                            有效时间:
                        </span>
                        <el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" v-model="startTime"
                            type="datetime" placeholder="选择日期时间">
                        </el-date-picker>
                        <span class="line"></span>
                        <el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" v-model="endTime" type="datetime"
                            placeholder="选择日期时间">
                        </el-date-picker>
                    </div>
                    <div class="content-search-box">
                        <span class="content-search-name">
                            状态:
                        </span>
                        <el-select v-model="searchStatus" placeholder="">
                            <el-option v-for="item in searchOptions" :key="item.id" :label="item.label"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="content-search-box" @click="onSearch">
                        <el-button type="primary">搜索</el-button>
                    </div>
                </div>
                <div class="content-tabel">

                    <el-table tooltip-effect="dark" style="width: 100%" :data="dataTable" border
                        @selection-change="handleSelectionChange" empty-text="暂未找到该数据">
                        <el-table-column align="center" type="selection" width="55"></el-table-column>
                        <el-table-column align="center" type="index" label="序号" width="55"></el-table-column>
                        <el-table-column align="center" prop="activityName" label="优惠名称" width="230"></el-table-column>
                        <el-table-column align="center" prop="userBrandNames" label="商家名称" width="300">

                            <template slot-scope="scope">

                                <el-popover trigger="hover" placement="top">
                                    <div style="width: 400px;">
                                        {{scope.row.userBrandNames}}
                                    </div>
                                    <div slot="reference" class="name-wrapper">
                                        <span
                                            style="overflow: hidden; text-overflow: ellipsis;
                                display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical;">{{scope.row.userBrandNames}}</span>
                                    </div>
                                </el-popover>


                            </template>

                        </el-table-column>
                        <el-table-column align="center" prop="amountList" label="优惠活动" width="250">
                            <template slot-scope="scope">
                                <div v-if="scope.row.amountList.length < 5">
                                    <div v-for="(item, index) in scope.row.amountList" :key="index">
                                        <span>
                                            充{{item.rechargeAmount}}
                                            赠{{item.givingAmount}}
                                        </span>
                                    </div>

                                </div>

                                <ul v-else>
                                    <li v-for="(item, index) in scope.row.amountList" :key="index">
                                        <el-popover trigger="hover" placement="top">
                                            <div v-for="(subItem, subIndex) in scope.row.amountList" :key="subIndex">
                                                充{{subItem.rechargeAmount}}
                                                赠{{subItem.givingAmount}}
                                            </div>
                                            <div class="meta" slot="reference">
                                                <div v-if="index < 5">
                                                    充{{item.rechargeAmount}}
                                                    赠{{item.givingAmount}}
                                                    <span v-show="index == 4">...</span>
                                                </div>
                                            </div>
                                        </el-popover>
                                    </li>
                                </ul>
                            </template>
                        </el-table-column>
                        <el-table-column align="center" prop="time" label="有效时间" width="200">
                            <template slot-scope="scope">
                                <div v-if="+scope.row.type === 1">
                                    永久有效
                                </div>
                                <div v-else>
                                    <div>起: {{scope.row.startTime}}</div>
                                    <div>
                                        止: {{scope.row.endTime}}
                                    </div>

                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column align="center" prop="updateUserName" label="更新人" width="200"></el-table-column>
                        <el-table-column align="center" prop="updateTime" label="更新时间" :formatter="dateFormat"
                            width="200"></el-table-column>
                        <el-table-column align="center" prop="status" label="状态">
                            <template slot-scope="scope">
                                {{searchAllStatus[scope.row.status]}}
                            </template>


                        </el-table-column>
                    </el-table>

                </div>
                <div class="pagination">
                    <table-pagination :pager="pager" @change="searchTable"></table-pagination>

                </div>
                <div class="content-dialog">
                    <el-dialog :title="title" :visible.sync="dialogVisible" width="800px">
                        <div class="dialog-box">
                            <div class="dialog-box-operate">
                                <div class="dialog-box-name">
                                    <span class="sign">*</span>
                                    <span class="name">优惠名称:</span>
                                </div>
                                <div class="dialog-discount">
                                    <el-input v-model="input" placeholder="请输入优惠名称" maxlength="20" :disabled="disabled">
                                    </el-input>

                                </div>
                            </div>
                            <div class="dialog-box-operate activity">
                                <div class="dialog-box-name name">
                                    <span class="sign">*</span>
                                    <span class="name">优惠活动:</span>
                                </div>
                                <div class="dialog-el-form">
                                    <el-form :inline="true" :model="formInline" class="demo-form-inline">
                                        <div v-for="(item, index) in formInline.domains" :key="index"
                                            class="dialog-form">
                                            <el-form-item label='充值'>
                                                <el-input maxlength="7"
                                                    v-model="item.recharge" placeholder="请输入充值金额"
                                                    @input="getCount(item.recharge)" :disabled="item.isDisabled" @keyup.native="number">
                                                </el-input>
                                            </el-form-item>
                                            <el-form-item label='赠'>
                                                <el-input maxlength="7"
                                                    v-model="item.gift" placeholder="请输入赠送金额"
                                                    @input="getCount(item.gift)" :disabled="item.isDisabled" @keyup.native="number"></el-input>
                                            </el-form-item>
                                            <el-form-item label='总得'>
                                                <el-input v-model='item.givenAmount' disabled></el-input>
                                            </el-form-item>
                                            <div class="icon icon-circle" @click="addInput(index)">
                                                <i class="el-icon-circle-plus-outline"></i>
                                            </div>
                                            <div class="icon" @click="deleteInput(index)" v-if="index > 0">
                                                <i class="el-icon-remove-outline"></i>
                                            </div>

                                        </div>

                                    </el-form>
                                </div>

                            </div>
                            <div class="dialog-box-operate switch-box">
                                <div class="dialog-box-name">
                                    <span class="sign">*</span>
                                    <span class="name">有效时间:</span>
                                </div>
                                <div class="dialog-box-switch">
                                    <span class="dialog-box-switch-title">永久有效</span>
                                    <el-switch v-model="isShowPicker" class="switch" inactive-color="#cdcdcd">
                                    </el-switch>

                                    <div v-show="!isShowPicker">
                                        <el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd"
                                            v-model="time.startTime" type="datetime" placeholder="选择日期时间">
                                        </el-date-picker>
                                        <span class="line"></span>
                                        <el-date-picker format="yyyy-MM-dd" value-format="yyyy-MM-dd" v-model="time.endTime"
                                            type="datetime" placeholder="选择日期时间">
                                        </el-date-picker>
                                    </div>
                                    <!-- <el-date-picker v-show="!isShowPicker" v-model="time" type="daterange"
                                        range-separator="至" :start-placeholder="startPlaceholder"
                                        :end-placeholder="endPlaceholder" value-format="yyyy-MM-dd" unlink-panels>
                                    </el-date-picker> -->
                                </div>
                            </div>
                            <div class="dialog-box-operate">
                                <div class="dialog-box-name">
                                    <span class="sign">*</span>
                                    <span class="name">商家名称:</span>
                                </div>
                                <div>
                                    <el-select v-model="selectList" multiple placeholder="请选择" filterable
                                        reserve-keyword>
                                        <el-option v-for="item in options" :key="item.id" :label="item.name"
                                            :value="item.id">
                                        </el-option>

                                    </el-select>
                                </div>
                            </div>

                        </div>

                        <span slot="footer" class="dialog-footer">
                            <el-button @click="onClose" class="button-close">取 消</el-button>
                            <el-button type="primary" @click="onSubmit" :loading="loading">提 交</el-button>
                        </span>

                    </el-dialog>

                    <el-dialog title="删除优惠" :visible.sync="deleteVisible" width="500px">
                        <div class="delete-box">
                            <div class="icon-warning">
                                <i class="el-icon-warning"></i>
                            </div>
                            <div class="dialog-delete-title">
                                确认要删除
                                <span class="dialog-delete-name">“{{discountName}}”</span>
                                优惠设置吗
                            </div>

                        </div>
                        <span slot="footer" class="dialog-footer">
                            <el-button @click="dialogClosed" class="button-close">取 消</el-button>
                            <el-button type="primary" @click="onDeleteSubmit">提 交</el-button>
                        </span>

                    </el-dialog>
                </div>
            </div>




        </div>

    </div>
</body>
<!-- import Vue before Element -->
<div th:include="_footer_include :: #jsLib"></div>

<!-- import common js-->
<script th:inline="javascript">
    var merchantUserList = [[${ merchantUserList }]];//商户集合

    var addClueVM = new Vue({
        el: '#resourceApply',
        data: function () {
            return {
                id: '',
                loading: false,
                multipleSelection: [],//选择行
                pager: {
                    total: 0,
                    currentPage: 1,
                    pageSize: 20,
                },
                dataTable: [],
                searchOptions: [
                    {
                        id: 'all',
                        label: '全部'
                    }, {
                        id: 1,
                        label: '生效中'
                    }, {
                        id: 2,
                        label: '未生效'
                    }, {
                        id: 3,
                        label: '已结束'
                    },
                    {
                        id: 0,
                        label: '已删除'
                    }
                ],
                searchAllStatus: {
                    'all': '全部',
                    '0': '已删除',
                    '1': '生效中',
                    '2': '未生效',
                    '3': '已结束'

                },
                userId: '',
                searchStatus: 1,
                searchName: '',
                discountName: '',
                deleteVisible: false, // 是否显示删除弹框
                //弹窗内层
                innerVisible: false,
                colseTime: 3,
                timer: null,
                input: '',
                selectList: [],
                startPlaceholder: "开始日期",
                endPlaceholder: '结束日期',
                time: {
                    startTime: '',
                    endTime: ''
                },
                addIsDisabled: false,
                // editIsDisabled:true,//默认不可点击
                isShowPicker: false,
                title: '新建优惠',
                dialogVisible: false,
                disabled: false,
                formInline: {
                    domains: [{
                        recharge: '',
                        gift: '',
                        isDisabled: false,
                        givenAmount: ''
                    }]
                },
                options: merchantUserList,
                startTime: '',
                endTime: '',
                domainsMap: []

            }
        },

        watch: {
            // formInline: {
            //     handler(val, oldVal) {
            //         // var t = this;
            //         let domains = val.domains;
            //         domains = domains.map(item => {
            //             return item
            //         })
            //     //   this.getDomains();
            //     },
            //     deep: true
            // }

        },


        methods: {
            number(){
                console.log(this.formInline.domains)
                this.formInline.domains = this.formInline.domains.map(item => {

                    if( typeof item.gift === "string") {

                        item.gift = item.gift.replace(/[^\.\d]/g,'')
                        console.log(item.gift)

                        if(+item.gift[0] === 0) {
                            item.gift = '';

                        }
                    }
                    if( typeof item.recharge === "string") {
                        item.recharge = item.recharge.replace(/[^\.\d]/g,'')
                        if(+item.recharge[0] === 0) {
                            item.recharge = '';

                        }
                    }

                    return item
                })

            },
            searchTable() {

                this.getPageList()

            },
            handleSelectionChange(val) {
                this.multipleSelection = val;
            },
            // 校验
            checkActivity(domains = []) {
                let isFill = false;
                let isRepeat = false;
                const amountReqList = [];
                domains.forEach(item => {
                    if (!item.recharge || !item.gift) {
                        isFill = true;
                    }
                    amountReqList.push({
                        rechargeAmount: item.recharge,
                        givingAmount: item.gift
                    })
                })
                domains.reduce((mome, item) => {
                    mome.length && mome.forEach(subItem => {
                        if (subItem.recharge === item.recharge && subItem.recharge === subItem.recharge) {
                            isRepeat = true
                        }
                    })
                    mome.push({
                        recharge: item.recharge,
                        gift: item.gift
                    })
                    return mome
                }, [])
                return {
                    isFill,
                    isRepeat,
                    amountReqList
                }

            },
            onSubmit() {

                if (!this.input) {
                    this.$message('请输入优惠名称');
                    return
                }
                const domains = this.formInline.domains;


                domains.forEach(item => {
                    if (typeof item.gift === 'number') {
                        item.gift = item.gift.toString()
                    }
                    if (typeof item.recharge === 'number') {
                        item.recharge = item.recharge.toString()

                    }
                })



                let isAmountReq = false;

                domains.forEach(item => {
                    const gift = item.gift;
                    const recharge = item.recharge;

                    if ((gift.indexOf('0') > -1 && gift[0] == 0) || (recharge.indexOf('0') > -1 && recharge[0] == 0)) {
                        isAmountReq = true;

                    }

                })
                if (isAmountReq) {
                    this.$message('不支持输入非正整数');
                    return;

                }



                const { isFill, isRepeat, amountReqList } = this.checkActivity(domains)
                if (isFill) {
                    this.$message('请输入优惠活动，充值金额与赠送金额均必填');
                    return
                }
                if (isRepeat) {
                    this.$message('一个优惠活动中多条优惠规则间不可重复');
                    return
                }
                if (!this.selectList.length) {
                    this.$message('请选择商家名称');
                    return

                }


                amountReqList.forEach(item => {
                    item.givingAmount = +item.givingAmount;
                    item.rechargeAmount = +item.rechargeAmount;
                })


                const params = {
                    type: 1,
                    activityName: this.input,
                    userIdList: this.selectList,
                    amountReqList,

                }
                if (this.id) {
                    params.id = this.id;

                }



                const {startTime, endTime} = this.time;

                if (endTime && startTime > endTime) {
                    this.$message({
                        message: '结束时间不允许选择早于开始时间',
                        type: 'warning'
                    });
                    return;
                }
                if((!startTime || !endTime) && !this.isShowPicker) {
                    this.$message('请选择开始时间和结束时间');
                    return
                }

                if(!this.isShowPicker) {
                    params.type = 0;
                    params.startTime = startTime;
                    params.endTime = endTime;

                }


                this.loading = true;


                axios.post('/merchant/chargePreFerential/addOrUpdate', params).then(res => {
                    addClueVM.innerVisible = true;
                    addClueVM.loading = false;
                    addClueVM.getPageList();
                    addClueVM.multipleSelection = [];
                    addClueVM.dialogVisible = false;
                    this.$message({
                        message: '提交成功',
                        type: 'success'
                    })



                }).catch(err => {
                    console.log(err)
                })

            },
            onClose() {
                this.dialogVisible = false;
                this.startPlaceholder = '开始日期';
                this.endPlaceholder = '结束日期';
                this.time = {
                    startTime: '',
                    endTime: ''
                };
            },
            deleteInput(index) {

                this.formInline.domains = this.formInline.domains.filter((item, domainsIndex) => +domainsIndex !== +index)
            },
            addInput(index) {
                if (+this.formInline.domains.length > 9) {
                    this.$message('最多可创建10条优惠规则');
                    return


                }

                this.formInline.domains.splice(index + 1, 0, {
                    recharge: '',
                    gift: '',
                    isDisabled: false,
                    givenAmount: ''
                })
            },
            // 新建
            newBuild() {
                this.input = '';
                this.formInline = {
                    domains: [{
                        recharge: '',
                        gift: '',
                        isDisabled: false,
                        givenAmount: ''
                    }]
                };
                this.id = '';
                this.isShowPicker = false;
                this.time = {
                    startTime: '',
                    endTime: ''
                }
                this.startPlaceholder = '开始日期';
                this.endPlaceholder = '结束日期';
                this.selectList = [];
                this.colseTime = 3;
                this.title = '新建优惠';

                this.dialogVisible = true;

            },
            // 编辑
            editBuild() {
                this.colseTime = 3;
                if (this.multipleSelection.length > 1) {
                    this.$message('只允许选择一条数据进行编辑');
                    return
                }
                if (!this.multipleSelection.length) {
                    this.$message('请先选择需要修改的数据');
                    return

                }
                const {
                    activityName, //优惠名称
                    amountList, // 充值优惠
                    startTime = '', // 开始时间
                    endTime = '', // 结束时间
                    id,  // 商家id
                    type, // 时间是否开始
                    userIdList = []
                } = this.multipleSelection[0];
                this.title = '编辑优惠';
                this.input = activityName;
                this.isShowPicker = +type === 1;
                this.formInline.domains = amountList.map(item => {
                    return {
                        recharge: +item.rechargeAmount,
                        gift: +item.givingAmount,
                        givenAmount: +item.givingAmount + +item.rechargeAmount
                    }
                })
                if (+type === 1) {
                    this.startPlaceholder = '开始日期';
                    this.endPlaceholder = '结束日期';
                    this.time = {
                        startTime: '',
                        endTime: ''
                    };

                } else {
                    this.time = {
                        startTime,
                        endTime
                    }
                }

                this.id = id;


                this.selectList = userIdList;
                this.dialogVisible = true;
            },
            // 删除确定
            onDeleteSubmit() {
                const ids = this.multipleSelection.reduce((mome, item, index) => {
                    if (index === 0) {
                        mome = item.id
                    } else {
                        mome = item.id + ',' + mome
                    }
                    return mome;
                }, '')
                const params = {
                    ids
                }
                axios.post('/merchant/chargePreFerential/batchDel', params).then(res => {
                    this.$message('删除成功');
                    addClueVM.deleteVisible = false;
                    addClueVM.getPageList();
                })

            },
            // 删除弹框
            deleteBuild() {
                if (!this.multipleSelection.length) {
                    this.$message('请先选择需要删除的数据');
                    return

                }
                const activityName = this.multipleSelection || [];
                this.discountName = activityName.reduce((mome, item, index) => {
                    if (index === 0) {
                        mome = item.activityName;
                    } else {
                        mome = item.activityName + '、' + mome;
                    }
                    return mome
                }, '')
                this.deleteVisible = true
            },
            dialogClosed() {
                this.$message('已取消删除');
                this.deleteVisible = false;
            },
            getPageList() {
                const { currentPage, pageSize } = this.pager;

                const userId = this.userId;


                const params = {
                    activityName: this.searchName,
                    userId,
                    startTime: this.startTime,
                    endTime: this.endTime,
                    pageSize: pageSize,
                    pageNum: currentPage,
                    status: this.searchStatus

                }
                if (this.searchStatus === 'all') {
                    params.status = '';
                }
                axios.post('/merchant/chargePreFerential/findPageList', params).then(res => {


                    let data = (res.data && res.data.data && res.data.data.data) || [];
                    addClueVM.pager.total = res.data.data.total;
                    addClueVM.pager.currentPage = res.data.data.currentPage;


                    data = data.map((item, index) => {
                        item.index = index;
                        if (item['startTime']) {
                            item.startTime = addClueVM.changTimeStatus(item['startTime'])
                        }
                        if (item['endTime']) {
                            item.endTime = addClueVM.changTimeStatus(item['endTime'])
                        }



                        return item;
                    })

                    addClueVM.dataTable = data;

                })
            },
            getCount(type) {
                if (type.indexOf('0') > -1 && +type[0] === 0) {
                    this.$message('不支持输入非正整数');
                    return

                }

                if (type && !type.match(/^\d+$/)) {


                    this.$message('不支持输入非正整数');
                    return

                }

                // console.log(this.formInline.domains)



                this.formInline.domains.forEach(item => {
                    const recharge = +item.recharge;
                    const gift = +item.gift;

                    let givenAmount = recharge + gift;
                    if (!recharge && !gift) {
                        item.givenAmount = ''

                    } else {
                        item.givenAmount = givenAmount
                    }


                });

            },
            onSearch() {

                if (this.endTime && this.startTime > this.endTime) {
                    this.$message({
                        message: '结束时间不允许选择早于开始时间',
                        type: 'warning'
                    });
                    return;
                }
                this.getPageList()

            },
            getIds(list) {
                const ids = list.reduce((mome, item, index) => {
                    if (index === 0) {
                        mome = item

                    } else {
                        mome = item + ',' + mome

                    }
                    return mome;
                }, '')
                return ids;

            },
            //日期数据格式化方法
            changTimeStatus(cellValue) {
                return moment(cellValue).format("YYYY-MM-DD");
            },
            //日期数据格式化方法
            dateFormat(row, column, cellValue, index) {
                if (cellValue == undefined) {
                    return "";
                }
                return moment(cellValue).format("YYYY-MM-DD HH:mm:ss");
            },
        },

        mounted() {
            document.getElementById('resourceApply').style.display = 'block';
            this.getPageList()
        }
    })
</script>

</html>